<!DOCTYPE html>
<!-- release v5.0.7, copyright 2014 - 2019 Kartik Visweswaran -->
<!--suppress JSUnresolvedLibraryURL -->
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <title>Krajee JQuery Plugins - &copy; Kartik</title>

<%@include file="../Api/bootstrap_inputfile.jsp" %>
</head>
<body>
<div class="container my-4">

    <form method="POST" enctype="multipart/form-data">
        <div class="file-loading">
            <input id="kv-explorer" name="file" type="file" class="form-control">
            <br>

        </div>
        <br>
        <!--<div class="file-loading">
            <input id="file-0a" class="file" type="file" multiple data-min-file-count="1" >
        </div>-->
        <!--<br>
        <button type="submit" class="btn btn-primary">Submit</button>
        <button type="reset" class="btn btn-outline-secondary">Reset</button>-->
    </form>
    <hr>
</div>
</body>
<script>
    $(document).ready(function () {
        $("#test-upload").fileinput({
            'theme': 'fas',
            'showPreview': false,
            'allowedFileExtensions': ['jpg', 'png', 'gif'],
            'elErrorContainer': '#errorBlock'
        });
        $("#kv-explorer").fileinput({
            'theme': 'explorer-fas',
            'uploadUrl': 'http://localhost:8080/jeeplus_war/api/upload',
            overwriteInitial: false,
            language: 'zh',
            initialPreviewAsData: true,
            allowedFileExtensions : ['jpg', 'png','gif'],//接收的文件后缀
            showUpload: true, //是否显示上传按钮
            showCaption: false,//是否显示标题
            browseClass: "btn btn-primary", //按钮样式
            previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
            // initialPreview: [
            //     "http://lorempixel.com/1920/1080/nature/1",
            //     "http://lorempixel.com/1920/1080/nature/2",
            //     "http://lorempixel.com/1920/1080/nature/3"
            // ],
            // initialPreviewConfig: [
            //     {caption: "nature-1.jpg", size: 329892, width: "120px", url: "{$url}", key: 1},
            //     {caption: "nature-2.jpg", size: 872378, width: "120px", url: "{$url}", key: 2},
            //     {caption: "nature-3.jpg", size: 632762, width: "120px", url: "{$url}", key: 3}
            // ]
        });
    });
</script>
</html>